
import { View, ScrollView, Text, Swiper, SwiperItem } from "@tarojs/components";
import React, { useState, useCallback } from "react";
import cls from "classnames";
import "./index.scss";
import DBScrollView from "@src/components/scroll-view";

const FollowPostList = () => {
    const category = [{
        categoryName: "全部"
    }, {
        categoryName: "油画"
    }, {
        categoryName: "摄影"
    }, {
        categoryName: "手工"
    },
    {
        categoryName: "素描"
    }, {
        categoryName: "卡通"
    }, {
        categoryName: "抽象"
    }, {
        categoryName: "穿搭设计"
    }, {
        categoryName: "家装设计"
    }, {
        categoryName: "另类"
    }, {
        categoryName: "行为艺术"
    }];
    const [current, setCurrent] = useState(0);
    const handleChange = useCallback((event) => {
        const { current } = event.detail;
        setCurrent(current);
    }, []);

    return (<View >
        {/* <ScrollView scrollX className="category" enableFlex showsHorizontalScrollIndicator={false}>
            {category.map((cate, index) => <View key={index} className={cls("category__item", index === current && "category__item-selected")} onClick={() => {
                setCurrent(index);
            }}
            ><Text>{cate.categoryName}</Text></View>)}
            <Swiper current={current}
              onChange={handleChange}
            >
                {category.map((cate, index) => {
                    return (
                        <SwiperItem key={index} />
                    );
                })}
            </Swiper>
        </ScrollView> */}
        {/* <DBScrollView 
          style={{ height:"100%",width:"100%" }}
          data={postList.data} 
          onViewableItemsChanged={handleItemsChanged}
          viewabilityConfig={{
        viewAreaCoveragePercentThreshold:50
      }}
          renderItem={({ item,index })=><CPostItem data={item}  key={`${item.id}_${index}`} allShow={visiableItemIds.includes(item.id)}  />}
          ItemSeparatorComponent={()=><View  className="scrollView__separator" />}
          ListFooterComponent={()=><Text className="scrollView__loading--bottom">{
        postList.pageNumber * postList.pageSize >= postList.total ? "我是有底线的" : "加载中。。。"
      }</Text>}
          ListEmptyComponent={()=><Fragment>
        {!postList.loading && !postList.data.length ? <View className="scrollView__emptyTips">小鹿正在努力产出内容，敬请期待</View> : <View className="scrollView__loading">Loading...</View>}
      </Fragment>}
          refreshing={refreshing}
          horizontal={false}
          showsVerticalScrollIndicator={false}
          onRefresh={(...args)=>{
          setRefreshing(true);
          setTimeout(async ()=>{
            await disPatch(getPostList({ refresh:true }));
            setRefreshing(false);
            },3000);
      }}
          onEndReached={()=>{
        // 加载更多
        console.log("到底部了");
        // disPatch(getPostList({}));
      }}
        /> */}
    </View>);
};

export default FollowPostList;